﻿<%@ page pageEncoding="UTF-8"%>
<%@ taglib prefix="isperp" uri="/WEB-INF/tlds/isperp.tld"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<style>
<!--
.fixed {
	position: fixed;
}

#searchTable  .J_valueList {
	display: inline-block;
}

#searchTable .J_valueList li {
	float: left
}

#dvFrameMainNav {
	overflow: auto;
	border: 1px solid #ddd;
	border-top: 2px solid #999;
}

.crumbs-nav-item .selector-set {
	float: left;
	margin-right: 5px;
}

.selector-set {
	font-size: 0;
}

.selector-set .ss-item {
	position: relative;
	display: inline-block;
	line-height: 22px;
	border: 1px solid #DDD;
	font-size: 12px;
	vertical-align: top;
	margin: 0 5px 5px 0;
	padding: 0 26px 0 4px;
	cursor: pointer;
}

.selector-set .ss-item em {
	color: #e4393c;
}

.selector-set .ss-item i {
	display: block;
	position: absolute;
	width: 25px;
	height: 22px;
	right: 0;
	top: 0;
	background: url('img/search_ele.png') no-repeat 7px -140px;
}

.selector-set .ss-item-const {
	padding-right: 5px;
}

.selector-set .ss-item-const i {
	background: none !important;
}

.selector-set .ss-item b {
	font-weight: 400;
}

.selector-set .ss-item:hover {
	border-color: #e4393c;
	text-decoration: none
}

.selector-set .ss-item:hover i {
	background-color: #e4393c;
	background-position: 7px -158px
}

.form-table .td1 {
	width: 120px;
}

.form-table .td2 {
	
}

.form-table .td3 {
	width: 70px;
}

.btn {
	display: inline-block;
	line-height: 14px;
	height: 14px;
	border-radius: 2px;
	background: #F7F7F7;
	text-align: center;
	text-decoration: none;
	cursor: pointer
}

.btn:hover {
	text-decoration: none;
	box-shadow: 0 1px 1px rgba(0, 1, 1, .08);
	cursor: pointer
}

.btn-default {
	display: inline-block;
	line-height: 14px;
	height: 14px;
	border-radius: 2px;
	background: #F7F7F7;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	border: 1px solid #DDD;
	padding: 4px 13px 5px;
	color: #666;
	background-color: #f7f7f7;
	background-repeat: repeat-x;
	background-image: -moz-linear-gradient(top, #f7f7f7, #f2f2f2);
	background-image: -webkit-linear-gradient(top, #f7f7f7, #f2f2f2);
	background-image: -o-linear-gradient(top, #f7f7f7, #f2f2f2);
	background-image: linear-gradient(top, #f7f7f7, #f2f2f2);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f7f7f7',
		endColorstr='#f2f2f2', GradientType=0 )
}

.btn-default:hover {
	text-decoration: none;
	box-shadow: 0 1px 1px rgba(0, 1, 1, .08);
	cursor: pointer;
	color: #666
}

.btn-primary {
	display: inline-block;
	line-height: 14px;
	height: 14px;
	border-radius: 2px;
	background: #F7F7F7;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	border: 0;
	padding: 5px 15px 6px;
	color: #FFF;
	background-color: #E74649;
	background-repeat: repeat-x;
	background-image: -moz-linear-gradient(top, #E74649, #DF3033);
	background-image: -webkit-linear-gradient(top, #E74649, #DF3033);
	background-image: -o-linear-gradient(top, #E74649, #DF3033);
	background-image: linear-gradient(top, #E74649, #DF3033);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#E74649',
		endColorstr='#DF3033', GradientType=0 )
}

.btn-primary:hover {
	text-decoration: none;
	box-shadow: 0 1px 1px rgba(0, 1, 1, .08);
	cursor: pointer;
	color: #FFF
}

.btn.disabled {
	padding: 4px 13px 5px;
	border: 1px solid #DDD;
	background: #FFF;
	cursor: default;
	color: #CCC;
	opacity: .2;
	filter: alpha(Opacity =  
		                                                                                           
		  20);
	filter: alpha(Opacity =  
		                                                                                           
		  20)
}

.btn.disabled:hover {
	color: #CCC
}

.btn-XL {
	height: 19px;
	line-height: 19px
}

.selector .s-title {
	border-bottom: 1px solid #DDD;
	background: #F1F1F1;
	line-height: 34px;
	height: 34px;
	overflow: hidden;
	zoom: 1
}

.selector .s-title h3 {
	float: left;
	padding-left: 10px
}

.selector .s-title h3 b {
	color: #e4393c;
	margin-right: 5px
}

.selector .s-title .st-ext {
	float: left;
	padding-left: 20px
}

.selector .s-brand,.selector .s-line {
	width: auto;
	height: auto
}

.selector .sl-wrap {
	position: relative;
	_zoom: 1;
	line-height: 34px;
	border-bottom: 1px solid #DDD
}

.selector .s-line:after {
	content: ' ';
	display: block;
	clear: both;
	height: 0;
	visibility: hidden
}

.selector .sl-key {
	float: left;
	width: 100px;
	padding-left: 10px
}

.selector .sl-value {
	margin-left: 110px;
	padding-right: 130px;
	padding-left: 10px;
	overflow: hidden;
	zoom: 1
}

.selector .sl-ext {
	position: initial;
	margin: 0px auto;
	right: 5px;
	width: 55px;
	height: auto;
	line-height: 22px;
	overflow: hidden;
	zoom: 1
}

.selector .sl-ext .sl-e-more i,.selector .sl-ext .sl-e-multiple i {
	background: url(img/search_ele.png) no-repeat 9999px 9999px;
	-webkit-transition: background-position .15s ease-in-out;
	-moz-transition: background-position .15s ease-in-out;
	transition: background-position .15s ease-in-out
}

.selector .sl-ext .sl-e-more {
	float: left;
	margin-right: 20px;
	position: relative;
	width: 50px;
	height: 22px;
	background: #fff;
	visibility: hidden;
	color: #333
}

.selector .sl-ext .sl-e-more i {
	position: absolute;
	top: 0;
	right: 0;
	display: block;
	width: 20px;
	height: 20px;
	border: 1px solid #DDD;
	background-position: 4px 7px
}

.selector .sl-ext .sl-e-more:hover {
	text-decoration: none;
	color: #e4393c
}

.selector .sl-ext .sl-e-more:hover i {
	border-color: #e4393c;
	background-position: 4px -11px
}

.selector .sl-ext .sl-e-more.opened i {
	background-position: 4px -27px
}

.selector .sl-ext .sl-e-more.opened:hover i {
	background-position: 4px -45px
}

.selector .sl-ext .sl-e-multiple {
	float: left;
	height: 20px;
	line-height: 20px;
	border: 1px solid #DDD;
	padding: 0 3px 0 18px;
	position: relative;
	background: #fff;
	color: #333
}

.selector .sl-ext .sl-e-multiple i {
	position: absolute;
	display: block;
	font-style: normal;
	left: 3px;
	top: 0;
	width: 13px;
	height: 20px;
	background-position: 0 -63px
}

.selector .sl-ext .sl-e-multiple:hover {
	text-decoration: none;
	color: #e4393c;
	border-color: #e4393c
}

.selector .sl-ext .sl-e-multiple:hover i {
	background-position: 0 -84px
}

.selector .sl-btns {
	display: none;
	text-align: center;
	padding-top: 5px;
	padding-bottom: 5px
}

.selector .sl-btns .btn-primary {
	margin-right: 8px
}

.selector .sl-v-list {
	overflow: hidden;
	zoom: 1;
	padding-top: 0px
}

.selector .sl-v-list ul {
	float: left;
	overflow: visible;;
	zoom: 1;
	position: relative;
}

.selector .sl-v-list li {
	float: left;
	_display: inline;
	margin-bottom: 1px;
	height: 22px;
	line-height: 22px;
	width: 150px;
}

.selector .sl-v-list li a {
	width: 150px;
}

.sl-v-list-ext li a {
	width: 125px;
}

.selector .sl-v-list li a {
	float: left;
	white-space: nowrap;
	zoom: 1;
	color: #005aa0;
}

.selector .sl-v-list li a:hover {
	text-decoration: none;
	color: #e4393c
}

.selector .sl-v-list .sl-price {
	float: left;
	margin-bottom: 4px;
	margin-top: 2px
}

.selector .sl-v-list .sl-price .btn,.selector .sl-v-list .sl-price .input-txt,.selector .sl-v-list .sl-price em
	{
	float: left
}

.selector .sl-v-list .sl-price .input-txt {
	width: 38px;
	padding: 1px
}

.selector .sl-v-list .sl-price em {
	line-height: 21px;
	padding: 0 3px;
	color: #CCC
}

.selector .sl-v-list .sl-price .btn {
	margin-left: 5px;
	*display: inline;
	padding: 2px 10px 3px
}

.selector .sl-v-logos ul {
	padding-top: 10px;
	margin-bottom: 10px;
	overflow: hidden;
	zoom: 1;
	height: 50px
}

.selector .sl-v-logos li {
	float: left;
	_display: inline;
	width: 116px;
	height: 48px;
	padding: 0;
	border: 1px solid #DDD;
	margin: -1px -1px 0 0;
	background: #FFF;
	text-align: center
}

.selector .sl-v-logos li a {
	display: block;
	border: 1px solid #FFF;
	height: 46px;
	width: 114px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	zoom: 1;
	color: #005aa0;
	line-height: 48px
}

.selector .sl-v-logos li a img {
	margin: 5px 6px;
	vertical-align: top
}

.selector .sl-v-logos li a:hover {
	text-decoration: none;
	color: #e4393c
}

.selector .sl-v-logos li a:hover img {
	display: none;
	_display: block;
	_margin: 0;
	_padding: 5px 6px
}

.selector .sl-v-logos li.selected,.selector .sl-v-logos li:hover {
	position: relative;
	z-index: 5;
	border-color: #e4393c;
	box-shadow: 2px 2px 3px rgba(0, 0, 0, .12)
}

.selector .sl-v-logos li.selected a,.selector .sl-v-logos li:hover a {
	border-color: #e4393c
}

.selector .sl-v-logos li.selected i {
	display: block;
	position: absolute;
	right: -2px;
	bottom: -1px;
	width: 10px;
	height: 10px;
	background: url(img/search_ele.png) no-repeat -2px -183px
}

.selector .sl-v-logos .v-fixed {
	height: 99px
}

.selector .sl-v-color {
	overflow: hidden;
	zoom: 1;
	height: 34px
}

.selector .sl-v-color ul {
	zoom: 1
}

.selector .sl-v-color li {
	float: left;
	_display: inline;
	margin-right: 10px;
	height: 28px;
	padding-top: 7px
}

.selector .sl-v-color li a {
	float: left;
	width: 20px;
	height: 20px;
	position: relative;
	overflow: hidden
}

.selector .sl-v-color li a b {
	display: block;
	width: 18px;
	height: 18px;
	border: 1px solid #ddd
}

.selector .sl-v-color li a i {
	display: none;
	position: absolute;
	right: -1px;
	bottom: -1px;
	width: 10px;
	height: 10px;
	background: url(img/search_ele.png) no-repeat -2px -183px
}

.selector .sl-v-color li a.black b {
	border-color: #333;
	background-color: #333
}

.selector .sl-v-color li a.light-gray b {
	border-color: #bbb;
	background-color: #bbb
}

.selector .sl-v-color li a.white b {
	border-color: #ddd;
	background-color: #fff
}

.selector .sl-v-color li a.pink b {
	border-color: #FFD8D8;
	background-color: #FFD8D8
}

.selector .sl-v-color li a.red b {
	border-color: red;
	background-color: red
}

.selector .sl-v-color li a.rose-red b {
	border-color: #FF028B;
	background-color: #FF028B
}

.selector .sl-v-color li a.purple b {
	border-color: #B237F1;
	background-color: #B237F1
}

.selector .sl-v-color li a.blue b {
	border-color: #2A8CFA;
	background-color: #2A8CFA
}

.selector .sl-v-color li a.green b {
	border-color: #17BC32;
	background-color: #17BC32
}

.selector .sl-v-color li a.orange b {
	border-color: #FF8A00;
	background-color: #FF8A00
}

.selector .sl-v-color li a.yellow b {
	border-color: #fc0;
	background-color: #fc0
}

.selector .sl-v-color li a.brown b {
	border-color: #814312;
	background-color: #814312
}

.selector .sl-v-color li a.light-tan b {
	border-color: #C69C81;
	background-color: #C69C81
}

.selector .sl-v-color li a.flesh-color b {
	border-color: #F3DCC9;
	background-color: #F3DCC9
}

.selector .sl-v-color li a.multi-color b {
	width: 20px;
	height: 20px;
	border: 0 none;
	background:
		url(//misc.360buyimg.com/product/list/1.0.4/css/i/search.icons.png)
		no-repeat 0 -146px
}

.selector .sl-v-color li.selected a b {
	border: 2px solid #e4393c;
	width: 16px;
	height: 16px
}

.selector .sl-v-color li.selected a i {
	display: block
}

.selector .sl-v-color li.selected a.multi-color b {
	background-position: -2px -148px
}

.selector .sl-b-letter {
	display: none;
	float: left;
	overflow: hidden;
	zoom: 1;
	padding-top: 6px;
	margin-bottom: 10px
}

.selector .sl-b-letter li {
	float: left;
	height: 20px;
	line-height: 20px;
	border: 1px solid #FFF;
	padding: 0 3px;
	cursor: default;
	text-align: center;
	color: #005aa0
}

.selector .sl-b-letter li.curr,.selector .sl-b-letter li:hover {
	border-color: #e4393c;
	color: #e4393c
}

.selector .sl-b-selected {
	overflow: hidden;
	zoom: 1;
	display: none
}

.selector .sl-b-selected .sl-b-key,.selector .sl-b-selected .sl-v-list {
	float: left
}

.selector .sl-b-search {
	display: none;
	float: left;
	width: 188px;
	height: 23px;
	border: 1px solid #ccc;
	margin-top: 5px;
	margin-left: 5px
}

.selector .sl-b-search i {
	float: left;
	width: 22px;
	height: 23px;
	background:
		url(//misc.360buyimg.com/product/list/1.0.4/css/i/search.icons.png)
		no-repeat 3px -117px
}

.selector .sl-b-search .input-txt {
	float: left;
	border: 0 none;
	width: 158px
}

.selector .sl-b-search .placehoder {
	color: #999
}

.selector .extend .sl-v-color ul,.selector .extend .sl-v-list ul,.selector .extend .sl-v-logos ul,.selector .multiple .sl-v-color ul,.selector .multiple .sl-v-list ul,.selector .multiple .sl-v-logos ul
	{
	height: auto
}

.selector .multiple {
	margin-top: -1px;
	border: 2px solid #edd28b;
	background: #fffdee
}

.selector .multiple .sl-key {
	padding-left: 8px
}

.selector .multiple .sl-value {
	margin-left: 108px;
	background: #fff
}

.selector .multiple .sl-ext {
	right: 8px
}

.selector .multiple .sl-e-more {
	visibility: hidden
}

.selector .multiple .sl-btns {
	display: block
}

.selector .multiple .sl-v-list li {
	
}

.selector .multiple .sl-v-list li a {
	position: relative;
	padding-left: 18px
}

.selector .multiple .sl-v-list li a i {
	position: absolute;
	left: 0;
	top: 3px;
	background: url(img/search_ele.png) no-repeat 9999px 9999px;
	display: inline-block;
	height: 12px;
	width: 12px;
	background-color: #fff;
	border: 1px solid #ccc;
	font-size: 0
}

.selector .multiple .sl-v-list li a:hover i {
	border-color: #e4393c
}

.selector .multiple .sl-v-list li.selected a i {
	border-color: #e4393c;
	background-position: -1px -107px
}

.selector .s-brand {
	_position: relative
}

.selector .s-brand .sl-v-list li {
	width: 130px;
	margin-right: 5px
}

.selector .s-brand .sl-v-list li a {
	width: 130px;
	display: inline-block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap
}

.selector .s-brand .sl-v-list .v-fixed {
	height: 60px
}

.selector .s-brand .extend,.selector .s-brand .multiple {
	margin-top: -1px;
	border: 2px solid #AAA;
	background: #f9f9f9
}

.selector .s-brand .extend .sl-b-letter,.selector .s-brand .multiple .sl-b-letter
	{
	display: block
}

.selector .s-brand .extend .sl-b-search,.selector .s-brand .multiple .sl-b-search
	{
	display: block;
	*display: inline
}

.selector .s-brand .extend .sl-key,.selector .s-brand .multiple .sl-key
	{
	padding-left: 8px
}

.selector .s-brand .extend .sl-value,.selector .s-brand .multiple .sl-value
	{
	margin-left: 108px;
	background: #fff
}

.selector .s-brand .extend .sl-ext,.selector .s-brand .multiple .sl-ext
	{
	right: 8px
}

.selector .s-brand .extend .sl-v-list,.selector .s-brand .multiple .sl-v-list
	{
	margin-bottom: 10px
}

.selector .s-brand .extend .sl-v-list .v-fixed,.selector .s-brand .multiple .sl-v-list .v-fixed
	{
	*width: 100%;
	height: 150px;
	overflow-x: hidden;
	overflow-y: auto
}

.selector .s-brand .extend .sl-v-logos .v-fixed,.selector .s-brand .multiple .sl-v-logos .v-fixed
	{
	overflow-y: auto;
	overflow-x: hidden;
	padding-top: 1px;
	height: 196px
}

.selector .s-brand .extend .sl-v-list.brand-selected,.selector .s-brand .multiple .sl-v-list.brand-selected
	{
	height: 34px
}

.selector .s-brand .extend .sl-v-list.brand-selected li,.selector .s-brand .multiple .sl-v-list.brand-selected li
	{
	width: auto;
	margin-right: 10px
}

.selector .s-brand .extend .sl-v-list.brand-selected li a,.selector .s-brand .multiple .sl-v-list.brand-selected li a
	{
	width: auto
}

.selector .s-brand .multiple {
	border: 2px solid #edd28b;
	background: #fffdee
}

.selector .s-brand .multiple .sl-v-list li a {
	width: 112px;
	padding-left: 18px
}

.selector .s-category .sl-v-list {
	*position: relative
}

.selector .s-category .sl-v-list li {
	width: 130px;
	margin-right: 5px
}

.selector .s-category .sl-v-list li a {
	width: 130px;
	display: inline-block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap
}

.selector .s-category .sl-v-list .v-fixed {
	height: 30px;
	*width: 100%
}

.selector .s-category .extend {
	margin-top: -1px;
	border: 2px solid #AAA;
	background: #f9f9f9
}

.selector .s-category .extend .sl-key {
	padding-left: 8px
}

.selector .s-category .extend .sl-value {
	margin-left: 108px;
	background: #fff
}

.selector .s-category .extend .sl-ext {
	right: 8px
}

.selector .s-category .extend .sl-v-list .v-fixed {
	overflow-x: hidden;
	overflow-y: auto;
	height: 150px
}
-->
</style>

<script type="text/javascript">
	var linkTemplate = '<a id="{id}" name="{id}" style="display:{display}" data-id="{id}" data-value="{dvalue}" class="ss-item" onclick="removeSearchCondition(\'{id}\')"><b>{namelabel}</b><em>{nametext}</em><i></i></a>';

	var linkTemplateConst = '<a id="{id}" name="{id}" data-id="{id}" data-value="{dvalue}" class="ss-item ss-item-const" ><b>{namelabel}</b><em>{nametext}</em><i></i></a>';

	var aTemplate = '<li><a onclick="changeSearchCondition(\'{id}\',this)" data-value="{dvalue}" data-label="{dlabel}" href="javascript:void(0)" title="{namelabel}" style="overflow: hidden;white-space: nowrap;text-overflow:ellipsis;">{namelabel}<i></i></a></li>';

	function renderTemplate(trid, namelabel, nametext, dvalue) {
		return linkTemplate.replaceAll("{id}", "d" + trid).replaceAll("{dvalue}", dvalue).replaceAll("{namelabel}", namelabel).replaceAll("{nametext}", nametext);

	}

	function renderTemplateConst(trid, namelabel, nametext, dvalue) {
	   if(namelabel.indexOf("请求日期")>-1)
	   {
	     return linkTemplate.replaceAll("{id}", "d" + trid).replaceAll("{dvalue}", dvalue).replaceAll("{namelabel}", namelabel).replaceAll("{nametext}", nametext).replaceAll("{display}", "none");
	   }else
	   {
	     return linkTemplate.replaceAll("{id}", "d" + trid).replaceAll("{dvalue}", dvalue).replaceAll("{namelabel}", namelabel).replaceAll("{nametext}", nametext).replaceAll("{display}", "");
	   }
		

	}

	function renderATemplate(trid, namelabel, dlabel, dvalue) {
		return aTemplate.replaceAll("{id}", trid).replaceAll("{dvalue}", dvalue).replaceAll("{namelabel}", namelabel).replaceAll("{dlabel}", dlabel);

	}

	function reloadGrid() {
		var url = "";
		var cdate = $(".selector-set a");
		$(cdate).each(function(index, item) {
			var $this = $(item);
			url += "&" + $this.data("id") + "=" + $this.data("value");
		});

		url = encodeURI(url);
		reloadSearchPanel(url);
		incidentSearchGrid.jqGrid.setGridParam({
			url : "incident/search/analysisList?projectId=${projectId}" + url
		});
		incidentSearchGrid.search();
	}

	function reloadSearchPanel(url) {
		isperp.showLoading();
		$.get("incident/search/reloadQueryPanelData?projectId=${projectId}" + url, function(data) {
			isperp.hideLoading();
			generalAlink(data.confirmtimeman_name, "tr2");
			generalAlink(data.supporter_name, "tr3");
			generalAlink(data.incident_type, "tr4");

			generalAlink(data.priority_name, "tr5");
			generalAlink(data.status, "tr6");
			generalAlink(data.sla_status, "tr7", 2);
			generalAlink(data.cus_user_name, "tr8");
			return data;
		})
	}

	function generalAlink(data, trid) {
		if (data) {
			var typeh = "";
			var i=0;
			var elseHtml="";
			var showAllStr=false;
			for ( var key in data) {
			    i=i+1;
				var ahtml = renderATemplate(trid, data[key].label + "(" + data[key].count + ")", data[key].label, key);
				
				if(i<16)
				{
				   typeh += ahtml;
				}else
				{
				    showAllStr=true;
				    elseHtml += ahtml;
				}
				
			}
			if(showAllStr)
			{
			  $("#" + trid + " .J_valueList").html("<div style='width:100%;display:block;color:red'> <input type='text' title='输入后按enter查询' placeholder='输入后按Enter查询' onchange=changeInput(this,'"+trid+"')></div>"+typeh+"<li style='width:100%;display:block;color:red'>...</li></ul><ul style='display:none' id='"+trid+"_elseUl'>"+elseHtml+"</ul>");
			}else
			{
			  $("#" + trid + " .J_valueList").html(typeh+elseHtml);
			}
			
		} else {
			$("#" + trid + " .J_valueList").html("");
		}
	}
	
	function changeInput(obj,trid)
	{
	  if(obj.value!="")
	  {
	    var tv=obj.value;
	    $("#"+trid+" li").show();
	    var tmpObj=$("#"+trid+" li");
	    $("#"+trid+"_elseUl").show();
	    tmpObj.each(function(){
	        var a=$(this).text();
	        if(a.indexOf(tv)>-1)
	        {
	          $(this).show();
	        }else
	        {
	           $(this).hide();
	        }
	    });
	  }else
	  {
	     $("#"+trid+" li").show();
	     $("#"+trid+"_elseUl").hide();
	  }

	}

	function changeSearchConditionByTree(event, treeId, treeNode) {

		var h;
		if ("departmentTree" == treeId) {
			h = renderTemplate("scl1", "部门：", treeNode.name, treeNode.id);
		} else if ("departmentTree2" == treeId) {
			h = renderTemplate("scl9", "请求人部门：", treeNode.name, treeNode.id);
		} else {
			h = renderTemplate("scl3", "分类：", treeNode.name, treeNode.id);
		}
		$("#scl1").html(h);
		reloadGrid();
	}

	function changeSearchConditionByDate(obj, t) {
		var y = $("#idYear").val(), m = $("#idMonth").val(), d = $("#idDay").val(), label, name;
		var y1 = $("#idYear1").val(), m1 = $("#idMonth1").val(), d1 = $("#idDay1").val(),label1,name1;

		if (d) {
			label = y + "年" + m + "月" + d + "日";
			name = y + "-" + m + "-" + d;
			
			label1 = y1 + "年" + m1 + "月" + d1 + "日";
			name1 = y1 + "-" + m1 + "-" + d1;
		}

		var h = renderTemplateConst("tr1", "请求日期起", label, name, name);
		var h1 = renderTemplateConst("tr2", "请求日期止", label1, name1, name1);

		$("#sctr1").html(h+h1);

		reloadGrid();
	}
	

	function removeSearchCondition(id) {
		$(".selector-set #" + id).remove();
		reloadGrid();
	}

	function changeSearchCondition(trid, obj) {
		var $tr = $("#searchTable #" + trid), namelabel = $tr.find(".td1").text(), $obj = $(obj), nametext = $obj.data("label"), v = $obj.data("value");

		//判断是否进行了选择操作
		var $td2 = $("#searchTable #" + trid + " .td2"), mu = $td2.hasClass("multiple");

		if (mu) {
			var pli = $obj.parent();
			if (pli.hasClass("selected")) {
				pli.removeClass("selected");
			} else {
				pli.addClass("selected");
			}

			if ($td2.find(".selected").length > 0) {
				if ($tr.find(".J_btnsConfirm").hasClass("disabled")) {
					$tr.find(".J_btnsConfirm").removeClass("disabled");
				}
			} else {
				$tr.find(".J_btnsConfirm").addClass("disabled");
			}

		} else {

			$("#sc" + trid).html(renderTemplate(trid, namelabel, nametext, v));

			reloadGrid();
		}
	}

	function changeSearchConditionConst(trid, obj) {
		var namelabel = $("#searchTable #" + trid + " .td1").text(), nametext = $(obj).data("label"), v = $(obj).data("value");

		$("#sc" + trid).html(renderTemplateConst(trid, namelabel, nametext, v));

		reloadGrid();
	}
	
	var showBtn='${showBtn}';
	function incidentGridActions(rowObject) {
	    if(showBtn=="1")
	    {
	       return isperp.createGridAction({
			 title : '催办',
			 iconCls : 'icon-notify',
			 onclick : "isperp.openDialog({title:'事件催办',windowSize:'normal',contentUrl:'app/message/sender/sendEdit?title=【催办】事件编号【" + rowObject.code + "】请速处理&sourceId=" + rowObject.id + "'})"
		   }) + isperp.createGridAction({
			 title : '转派',
			 iconCls : 'icon-change',
			 onclick : "isperp.workflow.transferAssignee('" + rowObject.process_id + "')"
		   });
	    }
	    else
	    {
	      return "";
	    }
		

	}
</script>
<div id="dvFrameMainNav" class="frame-main-nav">
	<div
		style="font-size: 14px;padding:5px 10px;background: #F7F7F7;color:#666">导航</div>

	<div id="accordion" style="width:200px">
		<h3>请求人部门</h3>
		<div>
			<isperp:tree id="departmentTree2" modal="false">
				<isperp:async enable="true" url="app/department/getCusUserTree">
				</isperp:async>
				<isperp:callback onClick="changeSearchConditionByTree"
					onAsyncSuccess="departmentTree2.zTree.expandAll(true);"></isperp:callback>
			</isperp:tree>
			<div style="display: none"></div>
		</div>
		<h3>分类</h3>
		<div>

			<isperp:tree id="categoryTree" modal="false">
				<isperp:async enable="true"
					url="incident/category/getTree?showAll=0">
				</isperp:async>
				<isperp:callback onClick="changeSearchConditionByTree"></isperp:callback>
			</isperp:tree>

		</div>

	</div>
</div>
<section id="mainContent" class="frame-main-cont frame-main-cont-first"
	style="top:5px" role="main">
	<div style="float:left;line-height: 25px;font-size: 14px;;color:#666">查询条件：</div>
	<div class="selector-set" style="height:25px;">
		<span id="sctr1"> 
		</span> <span id="scl1"></span> <span id="sctr2"></span><span id="sctr2"></span><span
			id="sctr3"></span><span id="sctr4"></span><span id="sctr5"></span><span
			id="sctr6"></span><span id="sctr7"></span><span id="sctr8"></span>
	</div>
	<div id="dvContainer">


		<table class="form-table selector" id="searchTable">
			<tr id="tr1">
				<td class="td1">请求日期：</td>
				<td class="td2" style="position: relative;" colspan="2">
					<div id="dateSelector"  style="display:inline-block;">
						<select id="idYear" name="idYear" data="" data-width="70px"
							onchange="changeSearchConditionByDate(this,1)"
							data-allow-empty="false" data-width="70px"></select>
						年
						<select
							data-width="60px" id="idMonth" name="idMonth" data=""
							data-width="60px" onchange="changeSearchConditionByDate(this,2)"
							data-allow-empty="false"></select>
						月
						<select id="idDay"
							data-width="60px" data-width="60px" name="idDay" data=""
							onchange="(this,3)"></select></div>

					&nbsp;&nbsp;至 &nbsp;&nbsp;
					<div id="dateSelector1" style="display:inline-block;">
						<select id="idYear1" name="idYear1" data="" data-width="70px"
							onchange="changeSearchConditionByDate(this,1)"
							data-allow-empty="false" data-width="70px"></select>年 <select
							data-width="60px" id="idMonth1" name="idMonth1" data=""
							data-width="60px" onchange="changeSearchConditionByDate(this,2)"
							data-allow-empty="false"></select>月 <select id="idDay1"
							data-width="60px" data-width="60px" name="idDay1" data=""
							onchange="changeSearchConditionByDate(this,3)"></select>
					</div> 
				</td>

			</tr>
			<tr id="tr6">
				<td class="td1">事件状态：</td>
				<td class="td2"><div class="sl-v-list">
						<ul class="J_valueList sl-v-list"></ul>
					</div>
					<div class="sl-btns">
						<a href="javascript:;"
							class="btn btn-primary J_btnsConfirm disabled">确定</a><a
							href="javascript:;" class="btn btn-default J_btnsCancel">取消</a>
					</div>
				</td>
				<td class="td3"><div class="sl-ext">
						<a href="javascript:;" class="sl-e-multiple J_extMultiple">多选<i></i>
						</a>
					</div>
				</td>
			</tr>
			<tr id="tr2" style="display: none">
				<td class="td1">担当：</td>
				<td class="td2"><div class="sl-v-list">
						<ul class="J_valueList sl-v-list"></ul>
					</div>
					<div class="sl-btns">
						<a href="javascript:;"
							class="btn btn-primary J_btnsConfirm disabled">确定</a><a
							href="javascript:;" class="btn btn-default J_btnsCancel">取消</a>
					</div>
				</td>
				<td class="td3"><div class="sl-ext">
						<a href="javascript:;" class="sl-e-multiple J_extMultiple">多选<i></i>
						</a>
					</div>
				</td>
			</tr>
			<tr id="tr8">
				<td class="td1">请求人：</td>
				<td class="td2"><div class="sl-v-list">
						<ul class="J_valueList sl-v-list-ext sl-v-list "></ul>
					</div>
					<div class="sl-btns">
						<a href="javascript:;"
							class="btn btn-primary J_btnsConfirm disabled">确定</a><a
							href="javascript:;" class="btn btn-default J_btnsCancel">取消</a>
					</div>
				</td>
				<td class="td8"><div class="sl-ext">
						<a href="javascript:;" class="sl-e-multiple J_extMultiple">多选<i></i>
						</a>
					</div>
				</td>
			</tr>
			<tr id="tr3">
				<td class="td1">工程师：</td>
				<td class="td2"><div class="sl-v-list">
						<ul class="J_valueList sl-v-list"></ul>
					</div>
					<div class="sl-btns">
						<a href="javascript:;"
							class="btn btn-primary J_btnsConfirm disabled">确定</a><a
							href="javascript:;" class="btn btn-default J_btnsCancel">取消</a>
					</div>
				</td>
				<td class="td3"><div class="sl-ext">
						<a href="javascript:;" class="sl-e-multiple J_extMultiple">多选<i></i>
						</a>
					</div>
				</td>
			</tr>
			<tr id="tr4">
				<td class="td1">事件性质：</td>
				<td class="td2"><div class="sl-v-list">
						<ul class="J_valueList sl-v-list"></ul>
					</div>
					<div class="sl-btns">
						<a href="javascript:;"
							class="btn btn-primary J_btnsConfirm disabled">确定</a><a
							href="javascript:;" class="btn btn-default J_btnsCancel">取消</a>
					</div>
				</td>
				<td class="td3"><div class="sl-ext">
						<a href="javascript:;" class="sl-e-multiple J_extMultiple">多选<i></i>
						</a>
					</div>
				</td>
			</tr>
			<tr id="tr5">
				<td class="td1">事件级别：</td>
				<td class="td2"><div class="sl-v-list">
						<ul class="J_valueList sl-v-list"></ul>
					</div>
					<div class="sl-btns">
						<a href="javascript:;"
							class="btn btn-primary J_btnsConfirm disabled">确定</a><a
							href="javascript:;" class="btn btn-default J_btnsCancel">取消</a>
					</div>
				</td>
				<td class="td3"><div class="sl-ext">
						<a href="javascript:;" class="sl-e-multiple J_extMultiple">多选<i></i>
						</a>
					</div>
				</td>
			</tr>

			<tr id="tr7">
				<td class="td1">SLA状态：</td>
				<td class="td2"><div class="sl-v-list">
						<ul class="J_valueList sl-v-list"></ul>
					</div>
					<div class="sl-btns">
						<a href="javascript:;"
							class="btn btn-primary J_btnsConfirm disabled">确定</a><a
							href="javascript:;" class="btn btn-default J_btnsCancel">取消</a>
					</div>
				</td>
				<td class="td3"><div class="sl-ext">
						<a href="javascript:;" class="sl-e-multiple J_extMultiple">多选<i></i>
						</a>
					</div>
				</td>
			</tr>
		</table>


		<div class="header" style="font-size: 14px;padding:10px;color:#666">
			事件清单&nbsp;&nbsp;&nbsp;<small style="font-size: 12px;color: #888">共<label
				id="incidentCount">0</label>条记录</small>
		</div>

		<isperp:grid url="incident/search/analysisList?projectId=${projectId}"
			autoload="false" gridId="incidentSearchGrid" sortname="create_date"
			sortorder="desc" showSearchbar="true" showToolbar="false"
			cusViewUrl="incident/incident/view" configColumns="true"
			actionsWidth="90" ondbClickRowEvent="incidentSearchGrid.view(rowid);"
			cusActions="incidentGridActions(rowObject);"
			loadComplete=" $('#incidentCount').text( incidentSearchGrid.jqGrid.getGridParam('records'));isperp.loadMessageCount(data);">


			<jsp:body>
			<isperp:column name="id" title="" hidden="true">
			</isperp:column>
				<isperp:column name="process_id" title="" hidden="true">
			</isperp:column>
			<isperp:column name="sla_status" title="" hidden="true"></isperp:column>
			<isperp:column name="priority_name" title="" width="40"
					isFormatterFun="true"
					formatter="return statusFormatter(rowObject);">
			</isperp:column>	
			
			<isperp:column name="code" title="编号" width="110">
			</isperp:column>
			<isperp:column name="title" title="标题" width="120">
			</isperp:column>
			<isperp:column name="icd_category_name" title="分类" width="80">
			</isperp:column>
				<isperp:column name="incident_type" title="性质" width="50">
			</isperp:column>
			<isperp:column name="cus_customer_name" title="申报单位" width="70">
		    </isperp:column>
			<isperp:column name="cus_user_name" title="申报人" width="60">
			</isperp:column>
			<isperp:column name="assigner_name" title="受理人" width="60">
			</isperp:column>
			<isperp:column name="supporter_name" title="工程师" width="60">
			</isperp:column>
			
			<isperp:column name="create_date" title="申报时间" width="110">
			</isperp:column>
			<isperp:column name="status" title="状态" width="80">
			</isperp:column>
			</jsp:body>
		</isperp:grid>

	</div>

</section>
<script type="text/javascript">
	$("#accordion").accordion({
		autoHeight : false,
		heightStyle : "content"
	});
	

	var myDate = new Date();
	$("#dateSelector").DateSelector({
		ctlYearId : 'idYear',
		ctlMonthId : 'idMonth',
		ctlDayId : 'idDay',
		defYear : myDate.getFullYear(),
		defMonth : (myDate.getMonth() + 1),
		defDay : 1,
		minYear : 2016,
		maxYear : (myDate.getFullYear() + 1)
	});
	$("#dateSelector1").DateSelector({
		ctlYearId : 'idYear1',
		ctlMonthId : 'idMonth1',
		ctlDayId : 'idDay1',
		defYear : myDate.getFullYear(),
		defMonth : (myDate.getMonth() + 1),
		defDay : myDate.getDate(),
		minYear : 2016,
		maxYear : (myDate.getFullYear() + 1)
	});

	function statusFormatter(rowObject) {
		var p = 0, html = "", title = "";
		if (rowObject.priority_name != null) {

			switch (rowObject.priority_name) {
			case "一级":
				p = 1;
				break;
			case "二级":
				p = 2;
				break;
			case "三级":
				p = 3;
				break;
			case "四级":
				p = 4;
				break;
			case "五级":
				p = 5;
				break;
			}
			title = "优先级：" + p + "级";
		} else {
			title = "未确定优先级";
		}

		html = "<img title='"+title+"' src='img/incident/p"+p+".png'>";
		if (rowObject.sla_status == 1) {

			html = html + "&nbsp;<img title='SLA：异常'  src='img/incident/sla_unusual.png'>";
		}
		return html + "&nbsp;<a id='msg_" + rowObject.id + "' href=\"javascript:openRelationMessage('" + rowObject.id + "')\" class=''></a>";
	}

	function openRelationMessage(id) {

		isperp.openDialog({
			title : "查看消息",
			contentUrl : "app/message/relationMessageView?all=1&sourceId=" + id
		});
	}

	var getScrollY = function() {
		scrOfY = 0;
		if (typeof (window.pageYOffset) == "number") {
			scrOfY = window.pageYOffset;
		} else if (document.body && (document.body.scrollLeft || document.body.scrollTop)) {
			scrOfY = document.body.scrollTop;
		} else if (document.documentElement && (document.documentElement.scrollLeft || document.documentElement.scrollTop)) {
			scrOfY = document.documentElement.scrollTop;
		}
		return scrOfY;

	}

	var pos_fixed_start_y = 0;
	var pos_fixed_stop_y = $(document).height() - $(window).height();
	$(window).scroll(function() {

		var y = getScrollY();

		if (y == 0) {
			$("#dvFrameMainNav").css({
				height : 'auto'
			});
		}
		var nav = $('#dvFrameMainNav');
		if (y >= pos_fixed_start_y && y <= pos_fixed_stop_y) {
			nav.addClass('fixed');
			resetTagTreeHeight();
		} else if (y > pos_fixed_stop_y) {
			nav.addClass('fixed');
			resetTagTreeHeight2();
		} else {
			nav.removeClass('fixed');
		}
	});

	var resetTagTreeHeight = function() {
		var tt = $("#dvFrameMainNav");
		var height = $(window).height();
		tt.css({
			height : height
		});
	};

	var resetTagTreeHeight2 = function() {
		var tt = $("#dvFrameMainNav");
		var height = $(window).height();
		tt.css({
			height : height
		});
	};

	resetTagTreeHeight2();
	changeSearchConditionByDate();

	//-----------------------------------------------

	$(function() {	
	    
		$(".J_extMultiple").click(function() {
			$(".selector td").removeClass("multiple");
			$(this).parent().parent().prev().addClass("multiple");
		});

		$(".J_btnsCancel").click(function() {

			$(this).parent().parent().removeClass("multiple");

		});

		$(".J_btnsConfirm").click(function() {
			if ($(this).hasClass("disabled")) {

				return false;
			} else {
				var trid = $(this).parent().parent().parent().attr("id");

				var $tr = $("#searchTable #" + trid), namelabel = $tr.find(".td1").text();
				var v = "";

				$tr.find(".selected a").each(function(index, item) {
					if (index > 0)
						v += "," + $(item).data("value");
					else {
						v += $(item).data("value");
					}
				});

				$("#sc" + trid).html(renderTemplate(trid, namelabel, v, v));

				$tr.find(".td2").removeClass("multiple");
				reloadGrid();
			}

		});

	});
</script>